<template>
	<view>
		<view class="nav-bar_2 flex-row">
			<image class="icon_2" referrerpolicy="no-referrer"
				src="https://lanhu.oss-cn-beijing.aliyuncs.com/pshgl28qpozte9a13f9wfchhruci5tdvbb5af65ab3-95f1-4846-b8b5-682e9d4f1264" @click="back" />
			<text class="text_2">人脸验证</text>
		</view>
		<view class="content">
			<view class="peopleImg">
				<view class="peopleImage">
					<image src="../../static/picture.jpg" mode=""></image>
				</view>
			</view>
			<view style="text-align: center;margin: 37rpx 0 30rpx 0;">请录制一段<text
					style="font-size: 30rpx;color: #C8A556;">多次眨眼</text>视频</view>

			<view style="display: flex;align-items: center;">
				<view :class="isAgreement?'or':''" @click="isAgreement=!isAgreement"
					style="margin-right: 10rpx;width: 40rpx;height: 25rpx;border-radius: 50%;border: #C8A556 1px solid;">
				</view>
				<view>本人已认真阅读，理解并同意《用户协议》《隐私协议》和《数
					字证书服务协议》</view>
			</view>


			<view>
				<navigator url="/subpkg/sign/sign" hover-class="navigator-hover" class="text_password">
					<button type="default">同意授权并继续<text>（3）</text></button>
				</navigator>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isAgreement: true
			}
		},
		methods: {
		back(){
      uni.navigateTo({
        url:'../nameLogin/nameLogin'
      })
    }

		}
	}
</script>

<style scoped>
	.or {
	  background-color: rgba(205, 173, 102, 1.000000);
	}
	.nav-bar_2 {
		background-color: rgba(55, 55, 55, 1);
		width: 750rpx;
		height: 100rpx;
		margin-top: -2rpx;
	}

	.icon_2 {
		width: 20rpx;
		height: 35rpx;
		margin: 36rpx 0 0 61rpx;
	}

	.text_2 {
		width: 110rpx;
		height: 26rpx;
		overflow-wrap: break-word;
		color: rgba(255, 255, 255, 1);
		font-size: 28rpx;
		font-family: SimHei;
		text-align: center;
		white-space: nowrap;
		line-height: 30rpx;
		margin: 41rpx 320rpx 0 239rpx;
	}

	.content {
		font-size: 26rpx;
		padding-top: 38rpx;
		width: 600rpx;
		margin: 0 auto;

	}

	.peopleImg {
		width: 570rpx;
		height: 561rpx;
		background: #E6E6E6;
		border-radius: 30rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #666666;
	}


	.peopleImage {
		width: 420rpx;
		height: 469rpx;
		background: #F2F2F2;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.peopleImage image {
		margin-top: 10rpx;
		width: 325rpx;
		height: 287rpx;

	}

	.checkText {
		font-size: 18rpx;
		color: #666666;
		display: flex;
		align-items: center;
		margin-top: 26rpx;
	}

	/deep/.uni-checkbox-input {
		border-radius: 50%;
		width: 18px;
		height: 18px;
		background: #FFFFFF !important;
		border: 2rpx solid #C8A556;
	}

	/deep/uni-checkbox:not([disabled]) .uni-checkbox-input:hover {
		border: 2rpx solid #C8A556;
		color: #C8A556 !important;
		font-size: 20rpx !important;
		background: #FFFFFF !important;
	}

	/deep/.uni-checkbox-input:hover {
		color: #C8A556 !important;
		border: 2rpx solid #C8A556;
		background: #FFFFFF !important;
	}

	/deep/uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked:before {
		font-size: 32rpx;
		color: #C8A556;
		background: #FFFFFF !important;
	}

	.text_password button {
		width: 570rpx;
		height: 70rpx;
		line-height: 70rpx;
		background: #A6A6A6;
		border-radius: 30rpx;
		color: #FFFFFF;
		font-size: 30rpx;
		margin-top: 40rpx;
	}
</style>
